最近接到一个小的项目,需要实现触屏滑动,图片缩放旋转移动,故而花了三天时间学习并实现了一下,在此记录一下学习过程:
关键就是css、 触屏手势
用到的技术:
css过渡 css2D转换 hammer.js AlloyFinger.js
css我就不说了,hammer.js与AlloyFinger.js 是属于轻量级的触屏手势封装库,其中水平移动用的是hammer.js,别的功能用的是AlloyFinger.js。
关键参数:
移动:X轴、Y轴
缩放:缩放的倍数
旋转:角度
这些参数都可以打印出来。
需要注意的是使用hammer.js实现移动后,我暂时没有办法使他从第一次滑动结束的位置接着继续滑动
我写的一个demo,https://github.com/liuguodong...
用到的技术官网链接:http://www.w3school.com.cn/cs...
https://hammerjs.github.io/
http://alloyteam.github.io/Al...
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。